<template>
  <view class="viewport">
    <scroll-view enable-back-to-top scroll-y class="scroll">
      <uni-section :title="ID ? '编辑' : '新增'" type="line">
        <view class="example">
          <uni-forms ref="baseForm" :modelValue="form">
            <uni-forms-item label="申请人">
              <uni-easyinput v-model="form.SendUserName" disabled="true" placeholder="申请人" />
            </uni-forms-item>
            <uni-forms-item label="加入群组">
              <uni-easyinput v-model="form.ToUserName" placeholder="请输入对方账户名称" />
            </uni-forms-item>
          </uni-forms>
        </view>
      </uni-section>
      <button class="button btn" @click="ok" v-if="!ID">申请</button>
      <button
        class="button btn"
        @click="OnAlertDialog"
        v-if="ID && form.ToUserName == memberStore.profile?.UserName && form.Status == '待同意'"
      >
        同意
      </button>
      <button
        class="button btn"
        @click="noAgree"
        v-if="ID && form.ToUserName == memberStore.profile?.UserName && form.Status == '待同意'"
      >
        不同意
      </button>
      <button class="button btn" @click="OnBackAlertDialog" v-if="ID && form.Status == '同意'">
        退出群组
      </button>
      <button class="button btn" @click="back">返回</button>
    </scroll-view>
  </view>
  <!-- 提示确认是否删除 弹窗 -->
  <uni-popup ref="alertDialog" type="dialog">
    <uni-popup-dialog
      type="warn"
      cancelText="取消"
      confirmText="同意"
      title="通知"
      content="确定同意加入您的群组么？"
      @confirm="agree"
      @close="cancel"
    ></uni-popup-dialog>
  </uni-popup>
  <!-- 退出群组 弹窗 -->
  <uni-popup ref="alertBackDialog" type="dialog">
    <uni-popup-dialog
      type="warn"
      cancelText="取消"
      confirmText="退出"
      title="通知"
      content="确定要退出群组么？"
      @confirm="backGroup"
      @close="cancelBack"
    ></uni-popup-dialog>
  </uni-popup>
</template>
<script setup lang="ts">
import { GetUserAccountAPI } from '@/services/detail'
import {
  AddNoticeAPI,
  AddUserGroupSettingAPI,
  AgreeUserGroupSettingAPI,
  DelNoticeAPI,
  GetGoodTypesAPI,
  GetOneNoticeAPI,
  GetOneUserGroupSettingAPI,
  NoAgreeUserGroupSettingAPI,
  UnBindUserGroupSettingAPI,
  UpdateNoticeAPI,
} from '@/services/job'
import { useMemberStore } from '@/stores'
import type { selectdata } from '@/types/job'
import type { Notice, UserGroupSetting } from '@/types/notelog'
import { onLoad, onShow } from '@dcloudio/uni-app'
import { ref } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute()
// 获取屏幕边界到安全区域距离
const { safeAreaInsets } = uni.getSystemInfoSync()
// 获取会员信息
const memberStore = useMemberStore()
const form = ref<UserGroupSetting>({
  ID: 0,
  NoticeMsg: '',
  SendUserName: '',
  ToUserName: '',
  Status: '',
})
//同意提示框
const alertDialog = ref<{
  open: (type?: UniHelper.UniPopupType) => void
  close: () => void
}>()
//退出提示框
const alertBackDialog = ref<{
  open: (type?: UniHelper.UniPopupType) => void
  close: () => void
}>()
const ID = ref<number>()
const goodTypedata = ref<selectdata[]>()
const accountFromdata = ref<selectdata[]>()
const accountTodata = ref<selectdata[]>()

//============================以下函数========================
//加载初始化
onLoad(async (option) => {
  console.log('ID' + option?.ID)
  ID.value = option?.ID
  form.value.ID = option?.ID
  if (!form.value.ID && memberStore.profile) {
    form.value.SendUserName = memberStore.profile.UserName
  }
  await reFresh()
})
/**
 * 获取任意时间
 */
const getDate = (date: Date, AddDayCount: number) => {
  if (!date) {
    date = new Date()
  }
  const dd = new Date(date)

  dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
  const y = dd.getFullYear()
  const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
  const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
  return {
    fullDate: y + '-' + m + '-' + d,
    year: y,
    month: m,
    date: d,
    day: dd.getDay(),
  }
}
//刷新事件
const reFresh = async () => {
  if (ID.value) {
    if (memberStore.profile) {
      const res = await GetOneUserGroupSettingAPI({
        Auth: memberStore.profile.Token,
        ID: ID.value,
      })
      form.value = res.result
    } else {
      uni.showToast({ icon: 'none', title: '请先登录' })
      setTimeout(() => {
        // 页面跳转
        uni.switchTab({ url: '/pages/my/my' })
      }, 500)
    }
  }
}

//返回
const back = () => {
  uni.navigateTo({ url: '/pages/NoteAcount/usergroup' })
}
//申请
const ok = async () => {
  const res = await AddUserGroupSettingAPI({
    Auth: memberStore.profile!.Token,
    SendUserName: form.value.SendUserName,
    ToUserName: form.value.ToUserName,
  })

  // 成功提示
  uni.showToast({ icon: 'success', title: '申请成功' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/NoteAcount/usergroup' })
  }, 500)
}
//打开同意框
const OnAlertDialog = async () => {
  alertDialog.value?.open()
}
//打开同意框
const OnBackAlertDialog = async () => {
  alertBackDialog.value?.open()
}
//取消
const cancel = async () => {
  alertDialog.value?.close()
}
//取消
const cancelBack = async () => {
  alertBackDialog.value?.close()
}
//确认退出群组
const backGroup = async () => {
  const res = await UnBindUserGroupSettingAPI({
    Auth: memberStore!.profile!.Token,
    ID: ID.value!,
  })
  // 成功提示
  uni.showToast({ icon: 'success', title: '退出成功' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/NoteAcount/usergroup' })
  }, 500)
}

//确认同意
const agree = async () => {
  const res = await AgreeUserGroupSettingAPI({
    Auth: memberStore!.profile!.Token,
    ID: ID.value!,
  })
  // 成功提示
  uni.showToast({ icon: 'success', title: '加入成功' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/NoteAcount/usergroup' })
  }, 500)
}
//不同意
const noAgree = async () => {
  const res = await NoAgreeUserGroupSettingAPI({
    Auth: memberStore!.profile!.Token,
    ID: ID.value!,
  })
  // 成功提示
  uni.showToast({ icon: 'success', title: '已拒绝加入' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/NoteAcount/usergroup' })
  }, 500)
}
</script>
<style lang="scss">
@import './styles/NoticeAdd.scss';
</style>
